<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>关系选择器</title>
    <style>
        h5{
            color:brown;
            text-indent: 28px;
        }

        p{
            color: darkcyan;
        }
    </style>
</head>
<body>
    <header>
        <h4>关系选择器分类</h4>

        <div>
            <h5>后代选择器</h5>
            <p>选择所有E 元素包含的F 元素</p>
            <p>语法 <br> E F{}</p>
            <a href="关系选择器.html">关系选择器</a>
        </div>
        <div>
            <h5>子代选择器</h5>
            <p>语法 <br> E>F{}</p>
            <a href="子代选择器.html">子代选择器</a>
        </div>
        <div>
            <h5>相邻兄弟选择器</h5>
            <p>语法 <br> E+F{}</p>
            <p>只能向下选择，下面的元素生效</p>
            <a href=" 相邻兄弟选择器.html"> 相邻兄弟选择器</a>
        </div>
        <div>
            <h5>通用兄弟选择器</h5>
            <p>语法 <br> E~F{}</p>
            <p>E 元素下面的 所有F 元素全部生效了</p>
            <a href="通用兄弟选择器.html"> 通用兄弟选择器</a>
        </div>
    </header>
    <article></article>
</body>
</html>